// components/ThemeSwitcher.tsx
import { useTheme } from "@heroui/use-theme";
import { SvgIcon } from '@/components/SvgIcon'
import { Button } from "@heroui/react";

interface ThemeSwitcherProps {
  isIcon?: boolean;
}
export const ThemeSwitcher = ({ isIcon }: ThemeSwitcherProps) => {
  const { theme, setTheme } = useTheme()

  const variant = theme === 'light' ? 'bordered' : 'solid'

  return (
    <Button
      color="secondary"
      isIconOnly
      variant={isIcon ? 'light' : variant}
      aria-label="Toggle theme"
      radius="full"
      onPress={() => setTheme(theme === 'dark' ? 'light' : 'dark')}
      className="text-lg"
    >
      {theme === 'light' ? <SvgIcon icon="line-md:moon-alt-to-sunny-outline-loop-transition" /> : <SvgIcon icon="line-md:moon-rising-filled-loop" />}
    </Button>
  )
};
